<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <style>
        body {
            height: 5000px;
        }

        .fa {
            position: relative;
            width: 500px;
            height: 500px;
            border: 1px solid #000;
        }

        .son {
            position: absolute;
            width: 100px;
            height: 100px;
            border: 1px solid #f00;
            top: 100px;
            left: 200px;
        }
    </style>
    <title>Document</title>
    <div class="fa">
        <div class="son"></div>
    </div>
    <style>

    </style>
    <script src="../js/jquery1.11.3.js"></script>

</head>
<!-- 
width() 方法设置或返回元素的宽度（不包括内边距、边框或外边距）。
    不传参数获取第一个width,number没有单位
    传入参数值（600），全部应用 改变行内样式
    传入回调函数（fn）  $('div').width((index, oldval) => oldval * 1.5)
height() 方法设置或返回元素的高度（不包括内边距、边框或外边距）。

innerWidth() ==clientwidth 可视区域的宽高 content+padding 默认是false
 
outerWidth()==offsetwidth content+pading+border
outerWidth(300)==offsetwidth content+pading+border=300 
outerWidth(true)==offsetwidth content+pading+border+margin
outerWidth(300,true)==offsetwidth content+pading+border+margin=300


 -->

<body>

    <script>
        $(function () {

            // 获取只会获取一个
            // console.log($('div').innerWidth())
            // console.log($('div').innerHeight())
            // let offsetLeft = $('.son').css('left') //定位和偏移了带单位200px
            // let res=$('.son')[0].offsetLeft //原始dom  200
            // let position=$('.son').position()
            // position.left=300
            // console.log(position.left,position.top) //200
            // console.log(offsetLeft,res,position.left)

            // 设置全部设置
            // $('div').innerWidth(200)
            // 回调函数设置 个性化设置
            // $('button').click(function () {
            //     $('div').innerWidth((index, oldval) => {
            //         return index == 0 ? oldval * (index + 1.2) : oldval * (index - 0.2)
            //     })

            // })

            let top = $(document).scrollTop()
            console.log(top)

        })

    </script>
</body>

</html>